إضافة نجوم التقييم إلى المشاركات الشائعة -إنّ الإضافات في مدونات وورد بريس او المواقع الخاصة بمقالات مراجعات الهواتف الذكية
والتطبيقات نجد بجانب المواضيع نجوم تقييم، وتوضع هذه النجوم بناءً على تقييم الكاتب لأداء الهاتف.
هُناك الكثير منا وانا واحد منهم كنا بحاجة لهذه الإضافة في بلوجر.
والتطبيقات نجد بجانب المواضيع نجوم تقييم، وتوضع هذه النجوم بناءً على تقييم الكاتب لأداء الهاتف.
هُناك الكثير منا وانا واحد منهم كنا بحاجة لهذه الإضافة في بلوجر.
إضافة اليوم شبيهة بإضافات منصة وورد بريس، لكنّ لا نستطيع التحكم بعدد النجوم ولا يستطيع الزائر تقييم المقال.
على عكس إضافة وورد بريس التي تسمح للزائر تقييم المقال بنفسهولكنّ هذه الإضافة مفيدة جدا للمدونات التي تعمل على منصة بلوجر لأنّ النجوم سوف تجذب اهتمام الزائر عندما يدخل المدونة، وهذا قد يؤدي إلى ارتفاع عدد النقرات على المواضيع
من قبل الزوار. لكنّ الاضافة تقوم بتقييم المواضيع بناءً على قوتها.
على عكس إضافة وورد بريس التي تسمح للزائر تقييم المقال بنفسهولكنّ هذه الإضافة مفيدة جدا للمدونات التي تعمل على منصة بلوجر لأنّ النجوم سوف تجذب اهتمام الزائر عندما يدخل المدونة، وهذا قد يؤدي إلى ارتفاع عدد النقرات على المواضيع
من قبل الزوار. لكنّ الاضافة تقوم بتقييم المواضيع بناءً على قوتها.
تركيب إضافة نجوم التقييم في المشاركات الشائعة
اولاً يجب إضافة الكود التالي فوق الوسم<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css' rel='stylesheet'/>
مُلاحظة: إذا كان الكود موجود في مدونتك لا تقوم بإضافته
ثانيًا: قُمّ بالدخول إلى لوحة تحكم بلوجر ثم اضغط على تبويب قالب، ثمّ تحرير HTML واضف الكود التالي فوق الوسم
الشكل الاول
/* Popular Post */
.PopularPosts ul{background:#fff;list-style:none;margin:0;padding:5px 5px 0;overflow:hidden;border-top:none}
.PopularPosts li,.PopularPosts li img,.PopularPosts li a,.PopularPosts li a img{margin:0;padding:0;list-style:none;border:none;background:none;outline:none}
.PopularPosts ul{margin:0;list-style:none;color:#64707a}
.PopularPosts ul li img{background:#fafafa;display:block;margin:0 0 0 10px;width:60px;height:60px;overflow:hidden;float:right;}
.PopularPosts ul li{position:relative;background-color:#fff;margin:0;padding:.7em 0!important;border:0;position:relative;border-bottom:1px dotted rgba(0,0,0,0.2)}
.PopularPosts ul li:before{font-family:fontawesome;content:'\f005\f005';display:inline-block;position:absolute;color:#f39c12;text-align:center;bottom:0;right:0;margin:9px 0;font-size:11px;padding:0;font-weight:normal;line-height:normal;transition:all .3s}
.PopularPosts ul li:nth-child(1):before{font-family:fontawesome;content:'\f005\f005\f005\f005\f005';}
.PopularPosts ul li:nth-child(2):before{font-family:fontawesome;content:'\f006\f005\f005\f005\f005';opacity:.9}
.PopularPosts ul li:nth-child(3):before{font-family:fontawesome;content:'\f006\f006\f005\f005\f005';opacity:.85}
.PopularPosts ul li:nth-child(4):before{font-family:fontawesome;content:'\f006\f006\f006\f005\f005';opacity:.8}
.PopularPosts ul li:nth-child(5):before{font-family:fontawesome;content:'\f006\f006\f006\f006\f005';opacity:.75}
.PopularPosts ul li:hover:before{opacity:1}
.PopularPosts ul li:first-child{border-top:none}
.PopularPosts ul li:last-child{border-bottom:none}
.PopularPosts ul li .item-title a,.PopularPosts ul li a{color:#333;font-size:11px;}
.PopularPosts ul li a:hover{color:#2476e0;}
.PopularPosts .item-thumbnail{margin:0;}
.PopularPosts .item-snippet{display:none}
.PopularPosts .item-title{font-weight:700;padding-bottom:.2em;padding:0 5px}
الشكل الثاني
/* Popular Post */
.PopularPosts ul{background:#fff;list-style:none;margin:0;padding:5px 5px 0;overflow:hidden;border-top:none}
.PopularPosts li,.PopularPosts li img,.PopularPosts li a,.PopularPosts li a img{margin:0;padding:0;list-style:none;border:none;background:none;outline:none}
.PopularPosts ul{margin:0;list-style:none;color:#64707a}
.PopularPosts ul li img{background:#fafafa;display:block;margin:0 0 0 10px;width:60px;height:60px;overflow:hidden;float:right;}
.PopularPosts ul li{position:relative;background-color:#fff;margin:0;padding:.7em 0!important;border:0;position:relative;border-bottom:1px dotted rgba(0,0,0,0.2)}
.PopularPosts ul li:before{font-family:fontawesome;content:'\f005\f005';display:inline-block;position:absolute;color:#f39c12;text-align:center;bottom:0;right:0;margin:9px 0;font-size:11px;padding:0;font-weight:normal;line-height:normal;transition:all .3s}
.PopularPosts ul li:nth-child(1):before{font-family:fontawesome;content:'\f005\f005\f005\f005\f005';}
.PopularPosts ul li:nth-child(2):before{font-family:fontawesome;content:'\f005\f005\f005\f005\f006';opacity:.9}
.PopularPosts ul li:nth-child(3):before{font-family:fontawesome;content:'\f005\f005\f005\f006\f006';opacity:.85}
.PopularPosts ul li:nth-child(4):before{font-family:fontawesome;content:'\f005\f005\f006\f006\f006';opacity:.8}
.PopularPosts ul li:nth-child(5):before{font-family:fontawesome;content:'\f005\f006\f006\f006\f006';opacity:.75}
.PopularPosts ul li:hover:before{opacity:1}
.PopularPosts ul li:first-child{border-top:none}
.PopularPosts ul li:last-child{border-bottom:none}
.PopularPosts ul li .item-title a,.PopularPosts ul li a{color:#333;font-size:11px;}
.PopularPosts ul li a:hover{color:#2476e0;}
.PopularPosts .item-thumbnail{margin:0;}
.PopularPosts .item-snippet{display:none}
.PopularPosts .item-title{font-weight:700;padding-bottom:.2em;padding:0 5px}
الشكل الثالث
/* Popular Post */
.PopularPosts ul{background:#fff;list-style:none;margin:0;padding:5px 5px 0;overflow:hidden;border-top:none}
.PopularPosts li,.PopularPosts li img,.PopularPosts li a,.PopularPosts li a img{margin:0;padding:0;list-style:none;border:none;background:none;outline:none}
.PopularPosts ul{margin:0;list-style:none;color:#64707a}
.PopularPosts ul li img{background:#fafafa;display:block;margin:0 0 0 10px;width:60px;height:60px;overflow:hidden;float:right;}
.PopularPosts ul li{position:relative;background-color:#fff;margin:0;padding:.7em 0!important;border:0;position:relative;border-bottom:1px dotted rgba(0,0,0,0.2)}
.PopularPosts ul li:before{font-family:fontawesome;content:'\f005\f005';display:inline-block;position:absolute;color:#f39c12;text-align:center;bottom:0;left:0;margin:9px 0;font-size:11px;padding:0;font-weight:normal;line-height:normal;transition:all .3s}
.PopularPosts ul li:nth-child(1):before{font-family:fontawesome;content:'\f005\f005\f005\f005\f005';}
.PopularPosts ul li:nth-child(2):before{font-family:fontawesome;content:'\f005\f005\f005\f005';opacity:.9}
.PopularPosts ul li:nth-child(3):before{font-family:fontawesome;content:'\f005\f005\f005';opacity:.85}
.PopularPosts ul li:nth-child(4):before{font-family:fontawesome;content:'\f005\f005';opacity:.8}
.PopularPosts ul li:nth-child(5):before{font-family:fontawesome;content:'\f005';opacity:.75}
.PopularPosts ul li:hover:before{opacity:1}
.PopularPosts ul li:first-child{border-top:none}
.PopularPosts ul li:last-child{border-bottom:none}
.PopularPosts ul li .item-title a,.PopularPosts ul li a{color:#333;font-size:11px;}
.PopularPosts ul li a:hover{color:#2476e0;}
.PopularPosts .item-thumbnail{float:right;margin:0;}
.PopularPosts .item-snippet{display:none}
.PopularPosts .item-title{font-weight:700;padding-bottom:.2em;padding:0 5px}
قمّ بإضافة أحد هذه الاشكال، ثُمّ قم بحفظ القالب.
اتمنى ان يكون الموضوع أعجبكم.
إضافة نجوم التقييم إلى المشاركات الشائعة
4
/
5
بواسطة
مدون محترف
أزال أحد مشرفي المدونة هذا التعليق.
ردحذفنعتذر منك لا ننشر روابط إشهار
حذفأزال أحد مشرفي المدونة هذا التعليق.
ردحذفلا شكر على واجب صديقي
حذفولكن اعذرني لا ننشر روابط اشهار
أزال أحد مشرفي المدونة هذا التعليق.
ردحذفاعتذر لمسح التعليق بسبب الرابط
حذفالمشكلة الان صدقًا مشغول كثيرا
لذلك لا يوجد وقت من اجل ان اقوم بتعريبه
اتمنى ان تعذرني
ممكن طلب اخي من فضلك
ردحذفتفضل اخي لو بقدر من عيوني
حذفاريد ازالة حقوق طبع ونشر من قاب موجود في مدونتك لك انا لا اريد ان اضيف اسمي أو شيئ من هدا فقط اريد ازالتها
حذفصديقي ولكن لماذا تريد إزالتها
حذففهي مجرد كلمة برابط فقط
ولن ينظر إليها احد على ما اعتقد
وهي عبارة عن تقدير لجهودنا في التعريب
اضافة جميلة =q =r
ردحذفشكراً لك مرورك الجميل
حذفأزال أحد مشرفي المدونة هذا التعليق.
ردحذفإن شاء الله اقوم بتعريب مثل هذه القوالب
حذفواعتذر لمسح التعليق بسبب الرابط
شكرا على الدرس
ردحذف" حملة شاركنا لندعمك - تم نشر موضوع في مدونتي "
لا شكر على واجب صديقي
حذفولكن الهاشتاغ لا يتم نشره هنا
وتم لدخول لمدونتك
لم اجد نظام التعليقات
اخى الشكل التانى مكرر
ردحذفلا صديقي يوجد اختلاف ولكنه بسيط جدًا
حذفاتخى انا عندى المشاركات مكان النجوم هل يمكن وضع النجوم الناحية الاخرى ؟
ردحذفنعم صديقي
حذففي اكواد css
ابحث عن right واجعلها left
ابحث عن left واجعلها right
وتغير ال padding , margin
فى الكود ذاته ولا فى القالب ؟
ردحذففي الكود ذاته
حذفالكود الخاص بالشكل
يسعدنا تفاعلكم بالتعليق , لكن يرجى مراعاة الآداب العامة وعدم نشر روابط إشهار حتى ينشر التعليق , ويمكنك ان تستخدم الإبتسامات بالوقوف عليها لمعرفة الكود. اولا تضع الـ = بعدها الحرف الخاص بالإبتسامة
=q =w =s =d =f =g =h =t =y =u =z =x =c =v =b =n =m =a =e =r