إضافة أداة المشاركات الشائعه بشكل أنيق وعصري بالوان خفيفه وانيقه جدا

إضافة أداة المشاركات الشائعه بشكل أنيق وعصري بالوان خفيفه وانيقه جدا

السلام عليكم ورحمة الله تعالى وبركاته سوف نتطرق في هذه التدوينه الى كيفية اضافة المشاركات الشائعه بشكل انيق وعصري بالوان خفيفه وانيقه جدآ حيث انها تتميز في كونها لا تاخذ حيزا كبيرا في تنسيق المدونة بالاضافه الى شكلها الذي يضيف لمسه جماليه الى المدونه 

والان اترككم مع كيفية اضافة هذه القطعه الى مدوناتكم 

صوره توضيحيه للاضافه

كيفية تثبيت هذه الاضافه على مدوناتكم

     1- من  لوحة التحكم -> قالب -> تحرير HTML -> تابع

     2- خذ نسخه احتياطيه لـ قالب المدونه قبل إجراء أية تغييرات 

     3-  الان ضع علامه لى توسيع القالب

     4- قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F)

]]></b:skin>

والصق الكود التالي قبله تمامآ

#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 40px 0px 0px; 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}

5-  الان قم بحفظ القالب

6-  اذهب الآن إلى لوحة التحكم -> تخطيط -> إضافة أداة -> المشاركات الشائعه 

7-  حدد كما في الصوره " عرض ما يصل إلى 9 مشاركات "، وإلغاء صور مصغره من الصورهو مقتطف 

وأخيرا قم بحفظ القطعه ومبروك عليكم الاضافه ، أتمنى أن تعجبكم بالتوفيق للجميع

Tweet

تنبيه : أرجو عدم نسخ المحتوى بدون ذكر المصدر و السلام

بقلم المطورون العرب

المطورون العرب هي مدونة مختصة في مجال التقنية و خاصة التصميم بدرجة أولى تليه الأخبار المرتبطة بالتكنولوجيا . كما نتطرق لشرح أغلب المسائل المطروحة حول بلوجر من تصميم قوالب و اضافات و ايضا نمدكم بدعم فني نلبي فيه أغلب طلباتكم المطروحة في هذه المجالات فان احتجت الى دعم فني ما عليك سوى الضغط على صفحة الدعم الفني ولا تآخذونا ان تأخرنا ...

تعليقك يساعدنا على المواصلة و يدعمنا نفسيا فلا تبخل علينا برأيك

قسم : اظافات بلوجر,كل