طريقة إضافة أداة آخر المواضيع بتقنية جد رائعة وحصريا على محترفي الإعلاميات

مرحبا شباب،
اليوم، وأنا ستعمل لتبادل "جديد متعدد الألوان - تعداد رقمي شعبية بوست القطعة للمدون". شعبية القطعة آخر القطعة مهمة جدا لمستخدمي المدون حتى هذه القطعة جعل أكثر جاذبية وسهلة الاستعمال. يحتاج المستخدمون للتنقل السهل قراءة مقالات جيدة وأكثر من ذلك بكثير هذه الميزة استخدام full.So جدا يتيح تحقق من هذه القطعة. 

1.لوحة التحكم
2.إضغط على قالب
3. ثم تحريرhtml
4.إضغط على متابعة
5.إختار توسيع القالب إختار
6.إبحث بالضغط على   CTRL+F عن الكود التالي :

]]></b:skin>

7.ثم ضع قبله الكود التالي مباشرةً :

 /* Multi colored - Numbered Popular  Post Widget By Trucsprofessional.blogspot.com*/

#PopularPosts4 ul li:hover{

background-color: #ffffff;

}

#PopularPosts1 ul li{border-bottom:2px dotted #999999;}

#PopularPosts1 ul li .item-thumbnail{-webkit-transition: all 0.5s ease-out;

-moz-transition: all 0.5s ease;

-o-transition: all 0.5s ease;

}

#PopularPosts1 ul li .item-thumbnail:hover{

-webkit-transform: rotate(-17deg);

-moz-transform: rotate(-17deg);

-o-transform: rotate(-17deg);

}

#PopularPosts1 ul li .item-title {color:#fff;}

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

#PopularPosts1 ul li{position:relative;margin:5px 0;border-bottom:1px dashed #ffffff;padding:10px}

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

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

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

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

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

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

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

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

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

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

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

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

#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{position:absolute;top:20px;right:-15px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIZnU2otwZgjhoC7sld5zDThyphenhyphenu9NZSC7hWP-Ev_URUILYKHr2PvLdjOPqCU4TqMrI_kiUMAyzjQb6jG2RQidcsSr_qJ94yVSJEIGzTpAzYueSWsQDOYX9zppBVr9oZ4jZ5DIhVaw34Dehd/s1600/waved-circle.png) no-repeat; width:32px;height:32px;text-align:center;font-size:15px; padding-top:13px; font-weight: bold; color:#ffffff;}

#PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:40px;height:40px; border-radius: 5px; border: 2px solid #ffffff;-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .4);-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .4);box-shadow: 0 1px 2px rgba(0, 0, 0, .4);}

#PopularPosts1 ul li a{font-size:12px;color:#fff;text-decoration:none}

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

#PopularPosts1 {

margin-left: 20px;

}

#PopularPosts1 h2 {color:white;

background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-bpoU1kA84pHW7vo8qBDJrCcHqIxc6Ncxm6hl67UYUC6nN_vCqM2blJcBbI2nCJ7W0ELrQdmQKbmqpWMyLtE4mqMZyXpyoyKf94u3TAziYyZta-Evf3p0UOPl8meHv-r90hCy-NDxF_ar/s1600/layer2.png) no-repeat;

height:30px;

width: 287px;

margin-left:-5px;

padding-top:10px;

font-size:18px;

text-align: center;

}

أتمنى أن يكون الدرس في متناول الجميع,في حال كان هنالك أي إستفسار لا تترددوا في وضع  إستفساراتكم في تعليق.

المرجو دعم الموقع من خلال الإشتراك على صفحاتنا على المواقع الإجتماعية و مشاركة الدروس مع أصدقاءكم.

هل أعجبك الموضوع ؟

الموضوع من طرف : منتصير شفيق

منتصير شفيق 24 سنة ،مدون مغربي مهووس بجديد تكنولوجيا المعلوميات ، مهتم بالحماية المعلوماتية يمكنك متابعته من خلال الفيس بوك . تويتر . جوجل بلس

ضع تعليقا أخي الكريم