اضافة صندوق المشاركات الشائعة بشكل مميز + بامكانك التعديل على شكلة

تنسيق مميز للمشاركات الشائعة بتأثير الإستدارة على الصور الكود حصري يمكن 

 لتركيب الاضافاة نذهب الى تخطيط -->إضافة أداة ---> HTML/JavaScript---> ننسخ الكود الخاص بالاضافة 

---> نضغط على حفظ .

.popular-posts li {

  list-style:none;

  margin:-7px -30px -5px 5px;

  text-align: right;

}

.PopularPosts .item-thumbnail {

  background:#D40147;

  border-radius: 0 8px 8px 0;

  float: right;

  margin: 0 0 0 8px;

  padding: 8px 8px 0;

}

.item-thumbnail img {

  background:#F1F1F1;

  border: 2px solid #777;

  border-radius: 50%;

  height: 58px;

  padding: 0;

  transition: all 1.5s ease 0s;

  width: 60px;

}

.item-thumbnail img:hover {transform: rotate(1440deg); -webkit-transform: rotate(1440deg);}

.PopularPosts .item-title {

  background:#ddd;

  border-radius: 8px 0 0 8px;

  height: 76px;

  margin: 0 5px;

  padding-bottom: 0.2em;

}

.popular-posts .item-title a {color: #222;}

.popular-posts .item-title a:hover {color: #D40147;}

شرح التنسيق

هذا #D40147 هو لون خلفية الصور
وهذا #F1F1F1 هو لون خلفية الحدود حول الصورة
وهذا #ddd هو لون خلفية الرابط
هذا #222 لون الرابط
وهذا #D40147 لونه عند التمرير
ملاحظات بسيطة
يجب ان تلغي تفعيل المقتطف من بتحرير آداة المشاركات الشائعة وازالة التأشير من جوار كلمة مقتطف
ايضاً لو لديك تنسيق داخل القالب للمشاركات الشائعة قد يتعارض مع هذا التنسيق فيجب حذف القديم اولا
يمكنك المحاولة بتحديد اكواد القديم ستجدها تحمل نفس معرف التنسيق
PopularPosts
وبالتوفيق