منتديات الهجان
هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.

منتديات الهجان


 
الرئيسيةأحدث الصورالتسجيلدخول

 

  إضافة أجمل تأثير على المشاركات الشائعة فى بلوجر

اذهب الى الأسفل 
كاتب الموضوعرسالة
الهجان
مستر وليد فريد
مستر وليد فريد
الهجان


ادعية لوجة الله : هوا الله
السرطان ذكر
عدد المساهمات : 4697
تاريخ الميلاد : 04/07/1975
تاريخ التسجيل : 21/09/2009
العمر : 48

 إضافة أجمل تأثير على المشاركات الشائعة فى بلوجر  Empty
مُساهمةموضوع: إضافة أجمل تأثير على المشاركات الشائعة فى بلوجر     إضافة أجمل تأثير على المشاركات الشائعة فى بلوجر  Icon_minitimeالأربعاء مايو 07 2014, 01:12

إضافة أجمل تأثير على المشاركات الشائعة فى بلوجر

 إضافة أجمل تأثير على المشاركات الشائعة فى بلوجر  300

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


  واليوم أقدم لكم شرح بسيط للحل
اقتباس :
شرح التركيب
 اذهب للوحة تحكم مدونتك >> القالب >> تحرير HTML >> ابحث عن 

الكود:
]]></b:skin>

 

>> ثم ضع فوقه كود الاضافــــــــــــــــــتة التى تناسبك
ملحوظة هامة : يجب اضافة أداة المشاركات الشائعة أولاً 
اقتباس :
الشكــــــــــــــــل الأول 
 إضافة أجمل تأثير على المشاركات الشائعة فى بلوجر  2014-01-04_135224

الكــــــــــــــــــــــود 
اقتباس :
الكود:

#PopularPosts1 ul li a:hover{color:#fff; 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:2px;border:1px
 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:0px
0px 0px 0px;border:1px solid #f7f7f7;-webkit-box-shadow:2px 2px 2px
#000;-moz-box-shadow: 3px 3px 3px #000;padding:10px;}

#PopularPosts1 img {

border-radius:0px;

max-width:60px;

max-height:60px;

margin-left:4px;

}
اقتباس :
الشكــــــــــــل الثانى 
♦ معاينــــــــــــــــة ♦
 إضافة أجمل تأثير على المشاركات الشائعة فى بلوجر  2014-01-04_135431
الكــــــــــــــــود 
اقتباس :
الكود:

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

}

راعى تغيير الألوان ودوران الأركان بالجزء الملون من الكود أعلاه 
أسأل اللـــــــه تعالى أن أكون قد وفيت الشرح
اقتباس :
كلمة شكر من الأعضاء تجعلنى ازداد فى العطاء
الرجوع الى أعلى الصفحة اذهب الى الأسفل
https://waled6662003.yoo7.com
 
إضافة أجمل تأثير على المشاركات الشائعة فى بلوجر
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1
 مواضيع مماثلة
-
» إضافة كود تصغير الصور في أداة المشاركات الشائعة لمدونة بلوجر
» حصريا كيفية إضافة تأثير علي صور لمدونات بلوجر
»  كيفية إضافة أداة أحدث أو آخر المواضيع إضافة صندوق إعجاب فيسبوك عائم مع تأثير الإضاءة - على طريقة الـ PopUp - يظهر مرة واحدة فقط ومنزلقة بشكل جديد وجذاب مع مصغرات الصور على مدونات البلوجر
» إضافة آخر المشاركات بشكل أكثر إحترافية فقط من مدوّن
» حصريا شرح إضافة جاري تحميل الصفحة لمدونة بلوجر

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
منتديات الهجان :: ركن بلوجر :: اضافات وهكات بلوجر-
انتقل الى: