مجموعه من المشاركات الشائعه 12 امر Popular Posts Widget

عدد المشاهدات الان

 التطبيق فقط ابحث عن وفوقه تلقائي واختر المناسب
]]></b:skin>

 

.popular-posts ul{padding-left:0px;}

.popular-posts ul li {background: #FFF no-repeat scroll 5px 10px;

list-style-type: none;

margin:0 0 5px 0px;

padding:5px 5px 5px 20px !important;

border: 1px solid #dcdcdc;

border-radius:10px;

-moz-border-radius:10px;

-webkit-border-radius:10px;

}

.popular-posts ul li:hover {

background:#FF8040;

}

.popular-posts ul li a

{

text-decoration:none;

font:14px Georgia, verdana;

color:#222222;

}

.popular-posts ul li a:hover {

text-decoration:none;

color:#fff;

}

 

#PopularPosts1 ul li a:hover{color:#fff;text-decoration:none}

#PopularPosts1 ul li a {-webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; color: #333333; display: block; font-family: Georgia, 'Times New Roman', Times, serif; font-size: 13px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 18px; margin: 0px 10px 0px -5px; min-height: 30px; orphans: 2; padding: 0px; text-align: -webkit-auto; text-decoration: none !important; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; }

#PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:51px;height:51px}

#PopularPosts1 ul li:first-child:after,

#PopularPosts1 ul li:first-child + li:after,

#PopularPosts1 ul li:first-child + li + li:after,

#PopularPosts1 ul li:first-child + li + li + li:after,

#PopularPosts1 ul li:first-child + li + li + li + li:after,

#PopularPosts1 ul li:first-child + li + li + li + li + li:after,

#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after,

#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after,

#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after,

#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{position:absolute;top:10px;right:5px;border-radius:50%;border:2px solid #ccc;background:#353535;-webkit-box-shadow:0px 0px 5px #000;-moz-box-shadow: 0px 0px 5px #000;width:30px;height:30px;line-height:1em;text-align:center;font-size:28px;color:#fff}

#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li {background:#DF01D7;width:90%}

#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after{content:"8"}

#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li{background:#B041FF;width:90%}

#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{content:"9"}

#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li +li{background:#F52887;width:90%}

#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{content:"10"}

#PopularPosts1 ul li:first-child + li + li + li + li +li{background:#7ee3c7;width:90%}

#PopularPosts1 ul li:first-child + li + li + li + li + li:after{content:"6"}

#PopularPosts1 ul li:first-child + li + li + li + li + li +li{background:#f6993d;width:90%}

#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after{content:"7"}

#PopularPosts1 ul li:first-child + li + li + li + li{background:#33c9f7;width:90%}

#PopularPosts1 ul li:first-child + li + li + li + li:after{content:"5"}

#PopularPosts1 ul li:first-child + li + li + li{background:#c7f25f;width:90%}

#PopularPosts1 ul li:first-child + li + li + li:after{content:"4"}

#PopularPosts1 ul li:first-child + li + li{background:#ffde4c;width:90%}

#PopularPosts1 ul li:first-child + li + li:after{content:"3"}

#PopularPosts1 ul li:first-child + li{background:#ff764c; width:90%}

#PopularPosts1 ul li:first-child + li:after{content:"2"}

#PopularPosts1 ul li:first-child{background:#ff4c54 ;width:90%}

#PopularPosts1 ul li:first-child:after{content:"1"}

#PopularPosts1 ul{margin:0;padding:0px 0;list-style-type:none}

#PopularPosts1 ul li{position:relative;margin:6px 0;border-radius:25px 0px 25px 0px;border:2px solid #f7f7f7;-webkit-box-shadow:3px 3px 3px #000;-moz-box-shadow: 3px 3px 3px #000;padding:10px;}

#PopularPosts1 img {

border-radius:200px;

width:60px; height:60px;

margin-left:4px;

}

.popular-posts ul

{

padding-left:0px;

-moz-box-shadow:1px 1px 2px #dcdcdc;

-web-kit-box-shadow: 1px 1px 2px #dcdcdc;

-goog-ms-box-shadow:1px 1px 2px #dcdcdc;

box-shadow:1px 1px 2px #dcdcdc;

border: 1px solid #dcdcdc;

}

.popular-posts ul li {

list-style-type: none;

margin:0 0 5px 0px;

padding:5px 5px 5px 20px !important;

border-bottom:1px dashed #dcdcdc;

background:#ffffff;

}

.popular-posts ul li a

{

text-decoration:none;

font:16px georgia,verdana;

color:#3d87c4;

}

.popular-posts ul li a:hover {

text-decoration:none;

color:#333333;

}

.popular-posts ul{padding-left:0px;}

.popular-posts ul li {background: #ffffff no-repeat scroll 5px 10px;

list-style-type: none;

margin:0 0 5px 0px;

padding:5px 5px 5px 20px !important;

border: 1px solid #dddddd;

border-radius:7px;

-moz-border-radius:7px;

-webkit-border-radius:7px;

}

.popular-posts ul li:hover {

border:1px solid #555555;

}

.popular-posts ul li a

{

text-decoration:none;

font:16px Georgia, verdana;

color:#333333;

}

.popular-posts ul li a:hover {

text-decoration:none;

color:#555555;

}

.popular-posts ul{padding-left:0px;}

.popular-posts ul li {

list-style-type: none;

margin:0 0 5px 0px;

padding:5px 5px 5px 20px !important;

border: 1px solid #dddddd;

-moz-box-shadow:1px 1px 2px #dcdcdc;

-web-kit-box-shadow: 1px 1px 2px #dcdcdc;

-goog-ms-box-shadow:1px 1px 2px #dcdcdc;

box-shadow:1px 1px 2px #dcdcdc;

border-radius:5px;

background: rgb(44,83,158); /* Old browsers */

background: -moz-linear-gradient(top, rgba(44,83,158,1) 0%, rgba(44,83,158,1) 100%); /* FF3.6+ */

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(44,83,158,1)), color-stop(100%,rgba(44,83,158,1))); /* Chrome,Safari4+ */

background: -webkit-linear-gradient(top, rgba(44,83,158,1) 0%,rgba(44,83,158,1) 100%); /* Chrome10+,Safari5.1+ */

background: -o-linear-gradient(top, rgba(44,83,158,1) 0%,rgba(44,83,158,1) 100%); /* Opera 11.10+ */

background: -ms-linear-gradient(top, rgba(44,83,158,1) 0%,rgba(44,83,158,1) 100%); /* IE10+ */

background: linear-gradient(to bottom, rgba(44,83,158,1) 0%,rgba(44,83,158,1) 100%); /* W3C */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2c539e', endColorstr='#2c539e',GradientType=0 ); /* IE6-9 */

}

.popular-posts ul li:hover {

-moz-box-shadow:1px 1px 2px #dcdcdc;

-web-kit-box-shadow: 1px 1px 2px #dcdcdc;

-goog-ms-box-shadow:1px 1px 2px #dcdcdc;

box-shadow:2px 2px 4px #333333;

border:1px solid #333333;

color:#fff;

}

.popular-posts ul li a

{

text-decoration:none;

font:16px Georgia, verdana;

color:#ffffff;

}

.popular-posts ul li a:hover {

text-decoration:none;

}

#PopularPosts1{width:300px}

.PopularPosts .widget-content ul{width:100%;padding:0;list-style-type:none;counter-reset:popcount}

.PopularPosts .widget-content ul li{padding:0;height:90px;overflow:hidden;position:relative;width:calc(50% - 5px);float:right;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}

.PopularPosts .widget-content ul li:nth-child(odd){margin:0 5px 10px 0;}

.PopularPosts .widget-content ul li:nth-child(even){margin:0 0 10px 5px;}

.PopularPosts .widget-content ul li a{color:#fff;text-decoration:none;font-size:12px;font-weight:500;}

.PopularPosts .widget-content ul li:hover .item-title{bottom:0}

.PopularPosts .widget-content ul li:hover img{-webkit-transform: scale(1.3);-ms-transform: scale(1.3);-o-transform: scale(1.3);transform: scale(1.3);}

.PopularPosts .widget-content ul li img{width:100%;height:90px;padding-left:0;transition:all .6s ease-in-out;}

.PopularPosts .item-thumbnail{float:none;margin:0 0 -4px}

.PopularPosts .item-title{padding:5px;position:absolute;bottom:-200px;right:0;left:0;text-align:right;background:rgba(0,0,0,.5);transition:all .3s ease-in-out;line-height: 1;}

.PopularPosts .item-thumbnail:before{list-style-type:none;padding:0;counter-increment:popcount;content:counter(popcount);position:absolute;width:30px;height:30px;line-height:30px!important;text-align:center;background:rgba(0,0,0,.5);right:0;top:0;color:#fff;font-size:20px;font-weight:900;line-height:1;z-index:2}

.PopularPosts .item-title a:hover{color:pink}

.PopularPosts .item-snippet{display:none}

.PopularPosts .widget-content ul li:hover .item-title{bottom:0px}

#PopularPosts1 ul li a:hover{color:#000; text-decoration: none !important; margin-bottom:0 !important;}#PopularPosts1 ul li a {-webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; color: #333333; display: block;font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 18px; margin-right:35px; min-height: 30px; orphans: 2; padding: 0px; text-align: -webkit-auto; text-decoration: none !important; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; }#PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;height:51px}#PopularPosts1 ul li:first-child:after,#PopularPosts1 ul li:first-child + li:after,#PopularPosts1 ul li:first-child + li + li:after,#PopularPosts1 ul li:first-child + li + li + li:after,#PopularPosts1 ul li:first-child + li + li + li + li:after,#PopularPosts1 ul li:first-child + li + li + li + li + li:after,#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after,#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after,#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after,#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{position:absolute;top:10px;right:5px;border-radius:50%;border:2px solid #ccc;background:#353535;-webkit-box-shadow:0px 0px 5px #000;-moz-box-shadow: 0px 0px 5px #000;width:30px;height:30px;line-height:1em;text-align:center;font-size:28px;color:#fff}#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li {width:90%}#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after{content:"8"}#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li{width:90%}#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{content:"9"}#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li +li{width:90%}#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{content:"10"}#PopularPosts1 ul li:first-child + li + li + li + li +li{width:90%}#PopularPosts1 ul li:first-child + li + li + li + li + li:after{content:"6"}#PopularPosts1 ul li:first-child + li + li + li + li + li +li{width:90%}#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after{content:"7"}#PopularPosts1 ul li:first-child + li + li + li + li{width:90%}#PopularPosts1 ul li:first-child + li + li + li + li:after{content:"5"}#PopularPosts1 ul li:first-child + li + li + li{width:90%}#PopularPosts1 ul li:first-child + li + li + li:after{content:"4"}#PopularPosts1 ul li:first-child + li + li{width:90%}#PopularPosts1 ul li:first-child + li + li:after{content:"3"}#PopularPosts1 ul li:first-child + li{width:90%}#PopularPosts1 ul li:first-child + li:after{content:"2"}#PopularPosts1 ul li:first-child{width:90%}#PopularPosts1 ul li:first-child:after{content:"1"}#PopularPosts1 ul{margin:0;padding:0px 0;list-style-type:none}#PopularPosts1 ul li { background:#FFFFFF; border: 2px solid #777777; border-radius: 25px 0; margin: 6px 0; padding: 10px; position: relative;}#PopularPosts1 ul li:hover{background:#F1FBFE; border: 2px solid #06BBFD;}#PopularPosts1 img {border-radius:200px;max-width:60px;max-height:60px;margin-left:4px;}

#PopularPosts1 dd { float: left; border-bottom: none; margin: 8px 8px 0 8px; background: none; display: block; padding: 0}

#PopularPosts1 img { -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; padding: 4px; background: #eee; background: -webkit-gradient(linear, left top, left bottom, from(#eee), color-stop(0.5, #ddd), color-stop(0.5, #c0c0c0), to(#aaa)); background: -moz-linear-gradient(top, #eee, #ddd 50%, #c0c0c0 50%, #aaa); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0 0 3px rgba(0,0,0,.7); -moz-box-shadow: 0 0 3px rgba(0,0,0,.7); box-shadow: 0 0 3px rgba(0,0,0,.7);}

#PopularPosts1 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);}

/***** Popular Post Widget for Blogger *****/

.sidebar .popular-posts ul {counter-reset: popcount;padding: 0;margin: 0;}

.sidebar .popular-posts ul li {float: left;position: relative;overflow: hidden;list-style: none !important;border: 0;height: 130px;width: 100%;font-family: “Oswald”,sans-serif;font-weight: bold;margin: 2px;padding: 0px !important;}

.sidebar .PopularPosts .item-thumbnail {width: 100%;margin: 0;}

.sidebar .PopularPosts ul li img {display: block;float: left;width: 100%;height: 130px;padding: 0;transition:1.0s;-webkit-transition-duration: 1.0s;-moz-transition-duration: 1.0s;-o-transition-duration: 1.0s;}

.sidebar .PopularPosts ul li img:hover {overflow: hidden;transform:scale(1.06);-webkit-transform:scale(1.06);-moz-transform:scale(1.06);-o-transform:scale(1.06);}

.sidebar .PopularPosts .item-title {position: absolute;padding-bottom: 0;z-index: 999;right: 0;left: 0;bottom:0;}

.sidebar .PopularPosts .item-title a {display: block;background: rgba(32, 32, 32, 0.77);font-family: “Oswald”,sans-serif;font-weight: bold;font-size: 16px;line-height: normal;color: #FFFFFF;text-transform: capitalize;padding: 10px 0px 5px 10px;transition: all .4s ease-in-out;}

.sidebar .popular-posts ul li:hover .item-title a {background: rgba(231, 76, 60, 0.88);color: rgba(255, 255, 255, 1);text-decoration: none;}

.sidebar .popular-posts ul li:before {counter-increment: popcount;content: counter(popcount, decimal);position: absolute;list-style-type: none;background: rgba(255, 252, 8, 1);float: left;color: #000;line-height: 20px;font-size: 14px;padding: 0px 8px 1px 1px;border-radius: 0px 0px 10px 0px;border-width: 0px 2px 2px 0px;border: solid #FFF;top: 0;z-index: 4;

/***** Popular Post Widget for Blogger *****/

.popular-posts ul{padding-left:0px;}

.popular-posts ul li a{color:#000; text-decoration:none; font-size:14px;}

.popular-posts ul li .item-title{float:right; width:70%;}

.popular-posts ul li {list-style-type: none;background: #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMEcW-_jUfIW1VPT8AWErwlUBW6_lkcRCruNu2eQ_TIQ4WNhwk0MJ0hz6IUkdTGvETRVoEX682WPVMb33BoUaBGaqOtdtSlcOs5cRm94PPuWVusNs0VMiJg_BtgWKRsJ65M8MyDoPMSa-l/s1600/bo-pp-arrow.gif) no-repeat scroll 5px 10px;border: 1px solid #ddd;padding:5px 5px 5px 20px !important;margin:0 0 5px 0px;border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;}

.popular-posts ul li:hover {border:1px solid #6BB5FF;}

.popular-posts ul li a:hover {text-decoration:none;}

.popular-posts .item-thumbnail img {float:left; width:80px; border-radius: 100px;-moz-border-radius: 100px;webkit-border-radius: 100px;

box-shadow: 0 1px 3px rgba(0, 0, 0, .4);-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);}

.sidebar .PopularPosts ul {

counter-reset: popularcount;

margin: 0;

padding: 0;

}

.sidebar .PopularPosts ul li {

width: 100%;

list-style: none !important;

padding: 0 !important;

margin-bottom: 20px;

position: relative;

border: 0;

}

.sidebar .PopularPosts .item-thumbnail a {

clip: auto;

display: block;

height: auto;

height: 120px;

}

.sidebar .PopularPosts .item-thumbnail {

width: 100%;

position: relative;

margin-bottom: 15px;

}

.sidebar .PopularPosts .item-thumbnail::before {

background: rgba(0, 0, 0, 0) none repeat scroll 0 0;

border-bottom: 29px solid #fff;

border-left: 29px solid transparent;

border-right: 29px solid transparent;

bottom: 0px;

content: &quot;&quot;;

height: 0;

width: 0px;

left: 0px;

right: 0px;

margin-left: auto;

margin-right: auto;

position: absolute;

z-index: 3;

}

.sidebar .PopularPosts .item-thumbnail:after {

color: #000;

content: counter(popularcount, decimal);

counter-increment: popularcount;

font: 13px &quot;Times New Roman&quot;,Times,FreeSerif,serif;

list-style-type: none;

position: absolute;

bottom: 0;

text-align: center;

margin: 0px auto;

left: 0px;

right: 0px;

z-index: 4;

}

.sidebar .PopularPosts .item-thumbnail img {

position: relative;

width: 100%;

height: 120px;

object-fit: cover;

}

.sidebar .PopularPosts .item-title {

font: 15px &#39;Oswald&#39;, sans-serif;

text-transform: uppercase;

text-align: center;

margin: 0px auto;

padding-bottom: 10px;

border-bottom: 1px solid #000;

}

.sidebar .PopularPosts .item-title a {

color: #000;

text-decoration: none;

}

.sidebar .PopularPosts .item-snippet {

padding: 10px 15px;

font: 13px &quot;Times New Roman&quot;,Times,FreeSerif,serif;

text-align: center;

}

.sidebar .PopularPosts ul {

padding: 0;

margin: 0;

}

.sidebar .PopularPosts .item-thumbnail a {

clip: auto;

display: block;

height: auto;

overflow: hidden;

}

.sidebar .PopularPosts .item-thumbnail {

width: 130px;

height: 130px;

border-right: 5px solid #fff;

margin: 0px 10px 0px 0px !important;

position: relative;

}

.sidebar .PopularPosts .item-thumbnail img {

position: relative;

height: 100%;

width: 100%;

object-fit: cover;

}

.sidebar .PopularPosts ul li {

float: left;

margin-bottom: 5px;

max-height: 130px;

min-width: 250px;

overflow: hidden;

}

.sidebar .PopularPosts ul li:first-child {

background: #D9EDF7;

}

.sidebar .PopularPosts ul li:first-child + li{

background: #F2DEDE;

}

.sidebar .PopularPosts ul li:first-child + li + li {

background: #DFF0D8;

}

.sidebar .PopularPosts ul li:first-child + li + li + li {

background: #FFEEBC;

}

.sidebar .PopularPosts ul li:first-child + li + li + li + li{

background: #E0E0E0;

}

.sidebar .PopularPosts .item-title {

font: 13px &#39;Oswald&#39;, sans-serif;

text-transform: uppercase;

padding: 10px 5px 10px;

}

.sidebar .PopularPosts .item-title a {

color: #000;

text-decoration: none;

}

.sidebar .PopularPosts .item-snippet {

font: 13px &quot;Times New Roman&quot;,Times,FreeSerif,serif;

padding-right: 5px;

}

.sidebar .PopularPosts .widget-content ul li {

padding: 0px 5px 0px 0px!important;

}

وسلامتكم
Popular Posts Widget

اذا حبيت نسخ المقالهـ