مساحة إعلانية

الأحد، 24 فبراير، 2013

الأحد، 24 فبراير، 2013

المشاركات الشائعة بشكل مميز مصغرات فقط

تعديل جميل على إضافة المشاركات الشائعة الخاصة بمنصة بلوجر Blogger سنعطيها شكل مميز ونجعلها عبارة عن مصغرات فقط Popular Posts Only  Thumbnail وهذا الشكل يتناسب مع المدونات التي ترغب في توفير مساحة
إن لم تكن إضافة المشاركات الشائعة موجوده في مدونتك قم بإضافتها ثم طبق الخيارات التالية عليها

ثم قم بالدخول لتحرير القالب وخذ نسخة إحتياطية لتجنب حدوث اخطاء ثم إضغط على سهم توسيع الستايل

وفوق الوسم ]]></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;}

ثم إبحث عن هذا الكود أو جزء منه حتى تجده

<!-- (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='http://2.bp.blogspot.com/-erTXCq61ULM/TmHYAQBZ0GI/AAAAAAAACCs/6cBX54Dn6Gs/s72-c/default.png'/>
       </b:if>
                  </a>
                </div>       
             </div>
            <b:else/>

هناك 18 تعليقًا:

  1. مشكور أخي العزيز على الإضافة الجميلة

    ردحذف
  2. حياك الله أخي عبد الجليل
    ودائما ما يسعدني مرورك يا طيب
    تحياتي لك

    ردحذف
  3. ررررررررررررروعه :9
    تم تطبيق الدرس لكن عندى مشكله
    لاتظهر صورة التدوينة :( تظهر فقط فى شكل التدوينات فى الرئيسية لكن فى السايد بار
    مش كلها بعض التدوينات وبعضها لا ومش عارف ليه
    ارجو مساعدتى :(
    http://mrboody.blogspot.com
    وشكرا

    ردحذف
  4. بالنسبة للصور احيانا يكون سبب عدم ظهورها الحجم
    أن يكون حجم الصورة كبير جدا فلا يتم إظهارها يفضل أن تجعل اول صورة في موضوعك بحجم مناسب أو ان موقع رفع الصورة لا يتيح أن تعرض في المصغرات لذا أنصحك برفع صور مواضيعك على بيكاسا

    ردحذف
    الردود
    1. مشكووووووووووووووور على الرد
      لكن ماهو الحجم المناسب حسب خبرتك ؟؟
      وماهو "بيكاسا" ؟؟
      وشكرا

      حذف
    2. حاول الا يزيد الطول او العرض عن 500px
      اما بيكاسا هو مخزن عملاق للصور تابع لجوجل تدخله ببريد Gmail
      وهذا هو رابطه وستجد عليه كل الصور التي رفعتها عن طريق مدونتك
      http://is.gd/PglmFH

      حذف
  5. تسلم ياغالى على الشرح
    بس انا ببحث عن الكود الثانى ولم اجده ياترى ايه المشكلة ؟

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

    ردحذف
  7. اذا كانت السماء تتباها بوجود القمر فيها من حق
    الارض ان تفرح بوجودك اخي عمرو عليها

    محبك أخوك أبو محمد

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

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

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

      حذف
  10. لدي مشكلة في المدونة
    الصور التي تكون مرفوعة على بلوجر تظهر أما الصور المرفوعة على أي موقع آخر لا تظهر

    ردحذف
    الردود
    1. هذا أمر طبيعي لان بلوجر تعتمد على مركز الرفع الخاص بجوجل بيكاسا وبالتالي ستواجه دائما مشكلة في ظهور الروابط من مراكز اخرى وانصحك ان ترفع عليه فهو دائم ثانيا مساحته مفتوحة يعني يمكنك ان تخزن جميع صورك الى الأبد ويفضل مراجعة هذا الموضوع للتعرف أكثر عليه
      http://cnmu.blogspot.com/2013/04/Picasa.html

      حذف
    2. شكراً لك على سرعة ردكم

      -------------

      لو سمحت كيف استطيع وضع بنر اعلاني بحجم 728*90 مثل مدونتك

      اريد وضعه بدلاً من بنر 468*60
      الذي في هذه المدونة

      http://www.newdailyinfo.com

      عندما اضع الكود يظهر نصف الاعلان فقط

      حذف
    3. القالب متجاوب لذلك هو معد عند عرضه في مساحة صغيرة ان يخفي ما يزيد عن اطاره فإن كنت تتصفح الموقع من جهاز لوحي او هاتف طبيعي ان يتم تصغيير البانر
      او ان كنت تتصفح من كمبيوتر بابعاد شاشة اكبر من 1024x768 ايضاً سيتم اخفاء الزائد غير ذلك المفترض ان يظهر لباقي الأجهزة بشكل واضح وكامل إلا لو كان القالب معد لمساحة اعلانية صغيرة فيمكنك وضعه ان اردت ويظهر لفئه كامل ولفئه اخرى مخفي جزء منه او اكتفي بالمقاس الموجود واراه مناسباً

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

    ردحذف
    الردود
    1. ألسبب أخي هو وجود تنسيق في قالبك يتعارض معها عموماً جرب التالي
      أضف هذا الكود فوق الوسم ]]></b:skin>
      .PopularPosts ul li {
      background: none repeat scroll 0 0 rgba(0, 0, 0, 0) !important;
      margin-left: 10px !important;
      margin-right: -10px !important;
      padding: 8px 0 !important;
      }

      حذف

نسعد ونتشرف بتعليقاتكم
لكن هناك شروط يجب اتباعها لضمان نشر التعليقات
1ان يكون التعليق يخص محتوى الموضوع
2ان لا يحتوي التعليق اى روابط دون داعي
3إن أردت إضافة كود حوله اولا بمحول الأكواد
4أن لا يحتوي التعليق اي الفاظ او اساءات لاى احد
5أى سؤال بعيد عن محتوى الموضوع يرجى استخدام ركن الأسئلة

جميع الحقوق محفوظة لــ كن مدون 2013-2015 ©