الاثنين، 14 يوليو 2014
السلام عليكم
كالعادة متابعي ورشة مدون الأوفياء اليوم سنرى كيفية التعديل على المشاركات الشائعة Popular Posts وجعلها جميلة وأكثر إحترافية ، بحيث سنجعلها عبارة عن صور مصغرة بدون مقتطف ، هذه الطريقة تفيد جدا أكثر الأخوان الذين يرغبون في توفير المساحة في مدونتهم ، الأن طريقة التركيب إن لم تكن قد أضفت أداة المشاركات الشائعة مسبقا فأضفها محافظا على الإعدادات التالية
مع كامل الشكر للأخ عمرو مصطفى مدير مدونة كن مدون الذي أفادنا بالأكواد ،هذا كل ما في موضوع اليوم أراكم في موضوع جديد بحول الله .
كالعادة متابعي ورشة مدون الأوفياء اليوم سنرى كيفية التعديل على المشاركات الشائعة Popular Posts وجعلها جميلة وأكثر إحترافية ، بحيث سنجعلها عبارة عن صور مصغرة بدون مقتطف ، هذه الطريقة تفيد جدا أكثر الأخوان الذين يرغبون في توفير المساحة في مدونتهم ، الأن طريقة التركيب إن لم تكن قد أضفت أداة المشاركات الشائعة مسبقا فأضفها محافظا على الإعدادات التالية
بعد ذلك نذهب للقالب نقوم أولا بحفظ نسخة تفاديا لإي مشكل أو في حالة لم تعجبك الإضافة
نقوم بتحرير html ثم نبحث عن هذا الكود التالي أو جزء منه
<!-- (3) Show only thumbnails -->
<div class='item-thumbnail-only'>
<b:if cond='data:post.thumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' target='_blank'>
<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
</a>
</div>
</b:if>
<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
</div>
<div style='clear: both;'/>
<b:else/>
بعدها نقوم بإستبداله بالكود التالي :
<!-- (3) Show only thumbnails -->
<div class='item-thumbnail-only'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' expr:title='data:post.title'>
<b:if cond='data:post.thumbnail'>
<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
<b:else/>
<img alt='' border='0' expr:height='data:thumbnailSize' expr:width='data:thumbnailSize' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhM3ctm1F7DZifX7U_cx0Q6ygOMNl9nFqC4e2pFy_9Z39wh4kvnJ_j2yMB5ETiSDLh-N9BUhhoxM5vs3P0usX8zFRHPX9aBNK2vqfEAdJRMRjIDfaFzrDASm9PY0d4s77SN3Um6e8F6QO4/s72-c/default.png'/>
</b:if>
</a>
</div>
</div>
<b:else/>
و أخيرا نبحث عن الوسم التالي ]]></b:skin> للتعديل على الستايل
بعد أن تجده ضع هذا الكود فوقه مباشرة
.popular-posts ul li {padding-right:0px; margin:-7px 0 -7px 0; float:right;width:33%;list-style-type:none;border:none;line-height:0px}
.popular-posts ul li img {width:80px;height:80px;opacity:1;filter:alpha(opacity=100);background:#fff;border:1px solid #818181;padding:3px;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;}
.popular-posts ul li img:hover {background:#000;border:1px solid #000;}
مع كامل الشكر للأخ عمرو مصطفى مدير مدونة كن مدون الذي أفادنا بالأكواد ،هذا كل ما في موضوع اليوم أراكم في موضوع جديد بحول الله .
هناك تعليقان (2):
يسعدنا تفاعلكم بالتعليق , أما لو لديك سؤال خارج الموضوع يرجى استخدام ركن الأسئلة ولإضافة كود قم بتحويله أولابمحول الأكواد , ويمكنك ان تستخدم الإبتسامات بالوقوف عليها لمعرفة الكود
=q =w =s =d =f =g =h =t =y =u =z =x =c =v =b =n =m =a =e =r
الاشتراك في:
تعليقات الرسالة (Atom)
مميزة
تعليقات الزوار
أرشيف المدونة الإلكترونية
-
▼
2014
(100)
-
▼
يوليو
(21)
- إضافة "هل أعجبك الموضوع؟" أسفل كل تدوينة
- شرح تحميل و تركيب قالب عرب تيك الإحترافي للمدونة ا...
- إضافة صندوق التبادل الإعلاني بتقنية css لمدونة بلوجر
- طريقة إضافة slader show المحترف بشكل صحيح
- تعرف على الفرق بين السمة "dofollow" و "nofollow" و...
- أفضل أكواد الميتا تاج ستجعل مدونتك في الصدارة
- إضافة أخر المواضيع للبلوجر بشكل متحرك
- تغير شكل و مظهر تعليقات بلوجر
- إضافة صندوق الإشترك بالبريد الإلكتروني و المواقع ا...
- إضافة قائمة منسدلة جانبية للصفحات الإجتماعية
- تحميل قالب "APOLLO" المعرب حصريا للوجر
- إضافة زر التمرير نحو الأعلى و الأسفل بتقنية Jquery
- إضافة المشاركات الشائعة بشكل أنيق و جذاب
- كيفية تنسيق قائمة و سحابة التسميات
- تحميل النسخة 2 من قالب "قالب الرائع"
- تحميل قالب بلوجر"Flat Mag" الأكثر إحترافية
- وضع رسالة ترحيبية أسفل القائمة الرئيسية
- تميز تعليقات صاحب المدونة عن تعليقات الزوار
- شرح أداة firebug لتسهيل إستخراج أكواد واجهات المواقع
- إضافة شريط أخر الأخبار لمدونة بلوجر
- إضافة مواضيع ذات صلة تحت كل موضوع
-
▼
يوليو
(21)
شرح ممتاز ومجهود مشكووووووووووووووووووور
ردحذفتسلم أخي الكريم مرحبا بك في أي وقت =s
حذف