24 أغسطس، 2015

مدون محترف اضافات بلوجر اضافة المشاركات الشائعة على شكل شبكة

اضافة المشاركات الشائعة على شكل شبكة

اضافة المشاركات الشائعة على شكل شبكة او البوم صور

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


شرح تركيب الإضافة


  1. ادخل إلى لوحة تحكم بلوجر
  2. انقر على تبويب قالب
  3. اضغط على تحرير HTML

ابحث عن الوسم ]]></b:skin> و اضف الكود التالي فوقه
/* CSS Recent Post Gallery */
.recent-gallery {padding:0;clear:both;}
.recent-gallery:after {content:"";display:table;clear:both;}
.recent-gallery .ad-item{display:inline-block;position:relative;margin:6px 0;overflow:hidden;}
.recent-gallery .ad-item a{position:relative;float:left;margin:0 6px;text-decoration:none}
.recent-gallery .ad-item .ptitle{background:rgba(0,0,0,.7);display:block;clear:left;font-size:10px;line-height:1.3em;position:absolute;text-align:left;bottom:3px;left:3px;right:3px;top:3px;color:#fff;padding:5px;word-wrap:break-word;overflow:hidden;visibility:hidden;opacity:0;backface-visibility:hidden;transition:all .2s}
.recent-gallery .ad-item:hover .ptitle{visibility:visible;opacity:1}
.recent-gallery a img{background:#fdfdfd;float:left;padding:2px;border:1px solid #e3e3e3;transition:all .3s}
.recent-gallery a:hover img {border-color:#bbb;}


ابحث عن الوسم </head> و اضف الكود التالي فوقه
<script type='text/javascript'>
//<![CDATA[
// Recent Post Gallery
function mudwnpgrid(a){for(var t=a.feed.entry||[],e=['<div class="recent-gallery">'],i=0;i<t.length;++i){for(var l=t[i],r=l.title.$t,n=l.media$thumbnail?l.media$thumbnail.url:"http://2.bp.blogspot.com/-4fCf53FqYKM/Vccsy7apoZI/AAAAAAAAK4o/XJkv3RkC0pw/s1600/default%2Bimage.png",s=n.replace("s72-c","s"+mudwnp_thumbs+"-c"),h=l.link||[],c=0;c<h.length&&"alternate"!=h[c].rel;++c);var d=h[c].href,m='<img src="'+s+'" width="'+mudwnp_thumbs+'" height="'+mudwnp_thumbs+'"/>',p=mudwnp_title?'<span class="ptitle">'+r+"</span>":"",g='<a href="'+d+'" target="_blank" title="'+r+'">'+m+p+"</a>";e.push('<div class="ad-item">',g,"</div>")}e.push("</div>"),document.write(e.join(""))}
//]]>
</script>

الان قم بحفظ القالب و اتجه إلى التخطيط > إضافة اداة جديدة >HTML/JavaScript و اضف الكود التالي

<script>
var mudwnp_thumbs = 72;
var mudwnp_title = true;
</script>
<script src="/feeds/posts/summary?max-results=9&amp;alt=json-in-script&amp;callback=mudwnpgrid"></script>

إعدادات التنسيق


max-results=9 : و هو المسؤل عند عدد المواضيع التي سوف يتم عرضها
var mudwnp_title = true : و هو المسؤل عن عرض العناوين
var mudwnp_thumbs = 72 : و هو المسؤل عن حجم الصور

ملحق


إذا اردت عرض مواضيع قسم معين استبدل اخر جزء من الكود بالاعلى بالتالي

<script src="/feeds/posts/summary/-/BLOGGER?max-results=9&amp;alt=json-in-script&amp;callback=mudwnpgrid"></script>

مع إستبدال كلمة BLOGGER باسم القسم المراد عرض مواضيع
و يمكنك إستبدال رقم 9 بالعدد الذي تريده و هو خاص بعدد المواضيع التي سيتم عرضها

دمتم بود


مواضيع ذات صلة
اضافة المشاركات الشائعة على شكل شبكة
4 / 5
بواسطة

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

  1. ماشاء الله عليك منير كن، شكل جميل للمشاركات الشائعة
    دائمًا ما أبحث عن أشكال جديدة لمدونتي وبفضلك.. أجِد كل الجديد
    باركك الله، وواصل تألقك حبيبي، أنتَ الأفضل - تحياتي #ليو

    ردحذف
    الردود
    1. مرورك الجميل اخي ليو
      دائما تدعمنا بتعليقاتك المشجعة
      احترامي و تقديري لشخصك الكريم =r

      حذف
  2. # حملة _ شاركنا _ لندعمك

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

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

      بالنسبة للإشهار صدقني انا لا اتبع اي وسائل لإشهار مدونتي
      فقط انشر روابط مدونتي في صفحتي على جوجل بلس و تويتر و فيسبوك

      حذف
  3. أزال أحد مشرفي المدونة هذا التعليق.

    ردحذف
    الردود
    1. نعتذر لمسح التعليق ولكن هاشتاغ الحملة فقط يُنشر داخل الموضوع الخاص به

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

    ردحذف
    الردود
    1. جميع المواضيع التي في مدونتنا سوف تجدها في مواقع و مدونات اجنبية
      لإنه اكثر المواضيع نقوم بترجمتها و نشرها هنا

      حذف
  5. رووووعه اخى منير والله متألق احب تدويناتك من القلب
    فقط اريد التواصل معك ع الفيسبوك وهذا فخر لى إذا كنت تستطيع ان تكتبه فى تعليق فأوك وإذا لم تستطع فيمكنك ان ترسل لى رابط حسابك على هذا الايميل
    eltaknia4@gmail.com

    ردحذف
    الردود
    1. شكراً لك يا غالي
      مرورك الروعة
      بالنسبة لحسابي على الفيسبوك بتمنى ما تفهمني خطأ بس هو شخصي
      يمكنك التواصل معي من خلال صفحتنا على فيسبوك

      https://www.facebook.com/mudwnp

      حذف
  6. الردود
    1. لا شكر على واجب صديقي

      =r

      حذف
  7. أزال أحد مشرفي المدونة هذا التعليق.

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

      حذف

يسعدنا تفاعلكم بالتعليق , لكن يرجى مراعاة الآداب العامة وعدم نشر روابط إشهار حتى ينشر التعليق , ويمكنك ان تستخدم الإبتسامات بالوقوف عليها لمعرفة الكود. اولا تضع الـ = بعدها الحرف الخاص بالإبتسامة
=q =w =s =d =f =g =h =t =y =u =z =x =c =v =b =n =m =a =e =r