اضافة المشاركات الشائعة بشكل جميل لدونته بلوجر2015

المشاركات الشائعة من أهم الأدوات التى نقدمها ، فهى تجعل الزائر يرى أشهر المواضيع فى المدونة مما يسهل عليه الوصول إلى أفضل المواضيع فى مدونتك لأنه يحقق أكبر نسبة مشاهدات فى المدونة ولكن شكل المشاركات الشائعة قد تكون تقليدية

الشرح

توجه الى لوحة التحكم في بلوجر واختر التعديل على HTML في القالب

قم بالبحث عن الوسم التالي :

]]></b:skin>

ثم أضف الكود التالي فوقه مباشرة :

#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;

}

ثم قم بحفظ القالب ومبروك عليك الاضافه

اضافة المشاركات الشائعة بشكل جميل لدونته بلوجر2015

4 / 5

بواسطة دروس احترافيه دوت نت

دروس احترافيه دوت نت في 10:48 ص اضف تعليق

الثلاثاء، 17 نوفمبر 2015